
let nav = document.querySelector("#nav");

let content = document.querySelector("#content");



    window.onload = function() {
        //获取浏览器的query参数
        function getUrlParams() {
            let href = location.href;
            let regExp = /.+\?(.+)/
            let param = regExp.exec(href)[1]
                console.log(param);
                // console.log(decodeURI(param));解码URI的参数编码

            let paramArr = param.split("&");
            console.log(paramArr);
            let query = {}
            paramArr.forEach(item => {
                itemArr = item.split("=");
                console.log(itemArr);
                query[itemArr[0]] = decodeURI(itemArr[1])
            })

            return query
        }

        let query = getUrlParams() //获取浏览器query参数
        console.log(query);

    ajax({
        url: "http://chst.vip:1234/api/getcategorybyid",
        data: query,
        success(res) {

            let html = "";
            res = res.result;
            console.log(res);
            res.forEach(item => {

                html += `
                <div>
                   <a href="../pages/index.html">首页</a>
                   &gt;
                   <a href="../pages/category.html">全部分类</a>
                   &gt;
                   <a href="#">${item.category}</a>
                   &gt;
                </div>
                <button class="btn">筛选</button>
                `
                nav.innerHTML = html
            })
        }
    })
    
    ajax({
        url:"http://chst.vip:1234/api/getproductlist",
        data: query,
        success(res){
            let html = "";
            res = res.result;
            console.log(res);
            res.forEach( item =>{
                html +=`
                <li productid=${item.productId}>
                    <a href="#">${item.productImg}</a>
                    <div>
                        <h5>${item.productName}</h5>
                        <p>${item.productPrice}</p>
                        <div>
                            <p>${item.productQuote}</p>
                            <p>${item.productCom}</p>
                        </div>
                    </div>
                </li> 
                `
                content.innerHTML = html;

                [...content.children].forEach(li =>{
                    li.onclick = function(){
                        let productid = this.getAttribute("productid")
                        // console.log(productid);
                        location.href = `../pages/shangpin.html?productid=${productid}`
                    }
                })
            })
        }
    })

}
